<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <title>Acceso al Sistema</title>
    </h:head>

    <h:body> 

        <h:form>
            <p:idleMonitor timeout="100"  />
            <h:panelGrid style="width:50%; text-align:right ;  margin:auto;">
                <p:growl id="growl" showDetail="true" life="3000" />  
                <h:outputLink id="loginLink" value="javascript:void(0)" onclick="dlg.show();"   >
                    <br />
                    <p:graphicImage value="#{resource['img:sgd.png']}"  />
                </h:outputLink>
                <p:tooltip for="loginLink" value="Click para Ingresar codigos de acceso al Sistema" />
                <p:dialog id="dialog"  position="center"  header="Acceso al Sistema" widgetVar="dlg" width="240" height="330" >
                    <h:panelGrid columns="2" cellpadding="5" >
                        <f:facet name="header">  
                            <p:graphicImage value="#{resource['img:userllave.png']}" />  
                        </f:facet>  
                        <h:outputLabel for="username" value="Usuario &nbsp;&nbsp; "  />
                        <h:inputText value="#{usuarioController.usuario.usuario}" style="color: blue ; font-size: 14px" size="10" id="username" required="true" label="username" />
                        <h:outputLabel for="password" value="Password" />
                        <h:inputSecret value="#{usuarioController.usuario.clave}" style="color: blue ; font-size: 14px" size="10" id="password" required="true" label="password" />
                        <f:facet name="footer">
                            <center>
                                <p:commandButton value="Login" action="#{usuarioController.logIn}"  update="growl" oncomplete="handleLoginRequest(xhr, status, args)"/>
                            </center>
                        </f:facet>
                    </h:panelGrid> 
                </p:dialog>
            </h:panelGrid>
        </h:form>
        <script type="text/javascript">
                    function handleLoginRequest(xhr, status, args) {
                        if (args.validationFailed || !args.loggedIn) {
                            jQuery('#dialog').parent().effect("shake", {times: 5}, 100);
                        } else {
                            dlg.hide();

                        }
                    }

                    function ahandleLoginRequest2(xhr, status, args) {
                        if (args.validationFailed || !args.loggedIn) {
                            PF('dlg').jq.effect("shake", {times: 5}, 1000);
                        }
                        else {
                            PF('dlg').hide();
                            $('#loginLink').fadeOut();
                        }
                    }
        </script>
    </h:body>
    <!--h:outputStylesheet library="css" name="default.css"/-->
</html>
